.mxBasicColor {
	position: relative;
	top: 2px;
	display: inline-block;
	width: 36px;
	height: 14px;
	margin-right: 10px;
	border-radius: 0;
}

.mxYellow {
	@extend .mxBasicColor;

	background: var(--badge-pending-background);
	border: 1px solid var(--badge-pending-border);
}

.mxBlue {
	@extend .mxBasicColor;

	background: var(--badge-running-background);
	border: 1px solid var(--badge-running-border);
}

.mxGreen {
	@extend .mxBasicColor;

	background: var(--badge-finished-background);
	border: 1px solid var(--badge-finished-border);
}

.mxRed {
	@extend .mxBasicColor;

	background: var(--badge-failed-background);
	border: 1px solid var(--badge-failed-border);
}

.mxGray {
	@extend .mxBasicColor;

	background: var(--badge-cancel-background);
	border: 1px solid var(--badge-cancel-border);
}
